<template>
	<view class="app">
		<main-tabbar></main-tabbar>
		<view class="jx-mybg-box">
			<block v-if="configData.user_center">
				<image v-if="configData.user_center.top_style == 3" :src="configData.user_center.style_bg_pic_url" class="jx-my-bg"></image>
				<image v-else :src="img_url+'/userTOP_logo.jpg'" class="jx-my-bg"></image>
			</block>
			<view v-if="userInfo && userInfo.identity && configData.user_center" class="jx-header-center"
				:class="configData.user_center.top_style == 3 ? 'right' : configData.user_center.top_style == 2 ? 'top' : ''">
				<image :src="userInfo.avatar || configData.user_center.member_pic_url" class="jx-avatar" @tap="href(3)"></image>
				<view class="jx-info">
					<view class="jx-nickname">
						<view class="nickname">{{ userInfo.nickname || '点击头像去设置昵称' }}</view>
					</view>
					<view class="flex flex-y-center">
						<view class="jx-img-vip">
							<image class="vip_url" v-if="userInfo.identity.member_pic_url" :src="userInfo.identity.member_pic_url"></image>
							<view class="iconfont icon-zuanshi" v-else></view>
							<view class="text">{{ userInfo.identity.level_name }}</view>
						</view>
						<view class="user-id">账号:BSH{{ userInfo.user_id }}</view>
					</view>
				</view>
				<!-- 社区团购 -->
				<view class="withdraw flex" v-if="0 == 1">
					<navigator url="./interests">
						<view class="icon-text flex" @click="showCode()">
							<image :src="img_url+'images/index/qrcode@2x.png'" class="icon-img img qrcode"></image>
							<view class="text">提货二维码</view>
						</view>
					</navigator>
				</view>
				<!-- 社区团购 -->
			</view>
			<block v-else>
				<view v-if="configData.user_center" class="jx-header-center flex flex-y-center" :class="{'flex-col':configData.user_center.top_style == 2,'marginB':configData.user_center.top_style == 2}">
					<image :src="configData.user_center.member_pic_url" class="jx-avatar"></image>
					<button type="primary" class="jx-info" @click="userLogin" style="margin-left: 0;margin-right: 0;">点击登录/注册</button>
				</view>
			</block>
		</view>
		<view class="jx-content-box" v-if="configData.user_center">
			<view class="jx-header-btm">
				<view class="jx-btm-item" @click="openUrl('balance')">
					<view class="jx-btm-num">{{ userInfo.balance }}</view>
					<view class="jx-btm-text">{{currencyAlias.balance_alias}}</view>
				</view>
				<view class="jx-btm-item" @click="openUrl('total_score')">
					<view class="jx-btm-num">{{ userInfo.total_score }}</view>
					<view class="jx-btm-text">{{currencyAlias.integral_alias}}</view>
				</view>
				<view class="jx-btm-item last" @click="openUrl('redBag')">
					<view class="jx-btm-num">{{ Number(userInfo.static_integral) }}</view>
					<!-- <view class="jx-btm-num">{{ Number(userInfo.dynamic_integral)+Number(userInfo.static_integral) }}</view> -->
					<view class="jx-btm-text">{{currencyAlias.red_envelope_alias}}</view>
				</view>
				<view class="jx-btm-item last" @click="openUrl('shopping_voucher')">
					<view class="jx-btm-num">{{ Number(userInfo.shopping_voucher)}}</view>
					<view class="jx-btm-text">{{currencyAlias.silver_beans_alias}}</view>
				</view>
			</view>

			<view class="jx-box jx-info-box" v-if="mytoken!=0 && userInfo && !userInfo.mobile" @click="openUrl(`mobile`)">
				<text class="text">请绑定你的手机号</text>
			</view>
			
			<view class="jx-box jx-order-box" v-if="configData.user_center.is_order_bar_status">
				<!-- <jx-list-cell :arrow="true" padding="0" :lineLeft="false" @click="href(4)"> -->
					<!-- <view class="jx-badge jx-badge-red" v-if="item.num">{{ item.num }}</view> -->
					<!-- <view class="jx-cell-sub">查看全部订单</view> -->
				<!-- <jx-list-cell :arrow="false" padding="0" :lineLeft="false" >
					<view class="jx-cell-header">
						<view class="jx-cell-title" style="font-weight: 700;">我的订单</view>
						
					</view>
				</jx-list-cell>
				<view class="jx-order-list">
					<view class="jx-order-item" @tap="openlink(item.link_url)" v-for="(item, i) in configData.user_center.order_bar" :key="i">
						<view class="jx-icon-box">
							<image :src="item.icon_url" class="jx-order-icon"></image>
							
						</view>
						<view class="jx-order-text">{{ item.name }}</view>
					</view>
				</view> -->
				<toolbar
					v-if="configData.user_center.is_order_bar_status != 0"
					:toolbarTitle="'我的订单'"
					:flex="configData.user_center.menu_style"
					:toolbarData="userMessage.user_center.order_bar"
				></toolbar>
				
			</view>
			
			<!-- 线下订单进销存 -->
			<view v-if="configData.user_center.order_offline && configData.user_center.order_offline.length">
				<toolbar-offline
					:toolbarTitle="'进销存订单'"
					:flex="configData.user_center.menu_style"
					:toolbarData="userMessage.user_center.order_offline"
				></toolbar-offline>
			</view>
			
			<view class="aui-palace aui-groups fui-cell-group" v-if="userInfo.parent_info">
				<view class="fui-cell">
					<view class="fui-cell-label f-6">我的供货商：</view>
					<view class="fui-cell-info f-6">
						{{userInfo.parent_info.nickname}}
					</view>
					<view v-if="userInfo.is_change_parent === 1" class="f-6" style="text-decoration: underline;color:#ff6600" @click="editParentModal = true"> 修改 </view>
				</view>

				<view class="fui-cell">
					<view class="fui-cell-label f-6">供货商手机：</view>
					<view class="fui-cell-info f-6">
						<a :href="'tel:' + userInfo.parent_info.mobile" >{{userInfo.parent_info.mobile}}</a>
					</view>
				</view>
			</view>
			
			<!-- 社区团购 -->
			<block v-if="0 == 1">
				<view class="address">
					<view class="address-title flex-x-between">
						<view class="title color-333333">我的当前自提点</view>
						<view class="cut-address flex">
							<view>切换自提点</view>
							<view class="iconfont icon-xiala"></view>
						</view>
					</view>
					<view class="address-info">
						<view class="store-name">员村友客便利店</view>
						<view class="store-detail color-333333">门店地址：广东省广州市天河区广州是天河区友客来便利店</view>
						<view class="store-tel color-333333">
							<span>门店号码：</span>
							<span style="color: #BC0100;">13710482718</span>
						</view>
						<view class="remark">
							<image :src="img_url+'images/index/shield.png'" mode="aspectFill" class="shield"></image>
							<span>如果您购买的商品有任何问题，请直接与购买的门店联系！ 门店讲为您处理，</span>
							<span class="color-333333">让您售后无忧!</span>
						</view>
					</view>
				</view>
			</block>
			<!-- #ifdef H5 -->
			<view v-if="configData.user_center.menus && configData.user_center.menus.length">
				<toolbar
					v-if="configData.user_center.is_menu_status != 0"
					:toolbarTitle="configData.user_center.menu_title"
					:flex="configData.user_center.menu_style"
					:toolbarData="userMessage.user_center.menus"
				></toolbar>
			</view>
			<!--#endif -->
			<!-- #ifdef MP-WEIXIN -->
			<view v-if="configData.user_center.menus && configData.user_center.menus.length">
				<toolbar
					v-if="configData.user_center.is_menu_status != 0"
					:toolbarTitle="configData.user_center.menu_title"
					:flex="configData.user_center.menu_style"
					:toolbarData="configData.user_center.menus"
				></toolbar>
			</view>
			<!--#endif -->
			<!-- #ifdef APP-PLUS -->
			<view v-if="configData.user_center.menus && configData.user_center.menus.length">
				<toolbar
					v-if="configData.user_center.is_menu_status != 0"
					:toolbarTitle="configData.user_center.menu_title"
					:flex="configData.user_center.menu_style"
					:toolbarData="configData.user_center.menus"
				></toolbar>
			</view>
			<!--#endif -->
		</view>
		<placeholder :placeholderHeight="placeholderHeight3"></placeholder>
		<jx-tips ref="toast"></jx-tips>
		<com-modal :show="modal" @cancel="hide" :custom="true">
			<view class="jx-modal-custom">
				<view class="jx-modal-custom-text">签到成功</view>
				<jx-button type="danger" shape="circle" @click="hide">确定</jx-button>
			</view>
		</com-modal>
		<com-modal :show="!!take_a_code" @cancel="codeHide()" :custom="true" width="350rpx" padding="20rpx">
			<view class="flex-y-center flex-x-center">
				<image class="tack-code" :src="take_a_code"></image>
			</view>
		</com-modal>
		<main-loading :visible="loading"></main-loading>


		<com-modal :custom="true" :show="editParentModal" padding="0" @cancel="closeHandler">
			<view class="jx-modal-title">修改供货商</view>
			
			<view>
				<view class="f-6" style="text-align: center;margin-top: 20rpx;padding: 20rpx;">供货商为平台时，或者未在商城消费过的用户。可自行修改供货商否则不支持修改~</view>
				<view class="shopSetting-item">
					<view class="shopSetting-title">
						手机号
					</view>
					<view class="shopSetting-int">
						<input type="text" placeholder="请填写供货商手机号" v-model="editParentForm.phone" />
					</view>
				</view>
				<view style="margin-top: 20rpx;padding: 30rpx;">
					<button @click="confirmSubmit" style="background-color: #fcc80e;color: #fff;font-weight: 600;">确定</button>
				</view>
			</view>
		</com-modal>
	</view>
</template>

<script>
import jxTips from '@/components/tips/tips';
import jxIcon from '@/components/icon/icon';
import jxButton from '@/components/extend/button/button';
import jxListCell from '@/components/list-cell/list-cell';
import toolbar from '@/components/toolbar/toolbar.vue';
export default {
	components: {
		jxIcon,
		jxButton,
		jxListCell,
		jxTips,
		toolbar
	},
	data() {
		return {
			modal: false,
			placeholderHeight3: 70,
			height: 64, //header高度
			top: 0, //标题图标距离顶部距离
			scrollH: 0, //滚动总高度
			opcity: 0,
			iconOpcity: 0.5,
			pageIndex: 1,
			loadding: false,
			pullUpOn: true,
			//导航栏数据
			tabCurrent: 3,
			selectedColor: '#bc0100',
			configData: {
				copyright: null,
				title_bar: null,
				user_center: null
			},
			mytoken:0,
			userInfo: {
				mobile:0,
				balance: 0,
				score: 0,
				total_score:0,
				coupon: 0,
				dynamic_integral:0,
				static_integral:0,
				shopping_voucher:0,
			},
			img_url: this.$api.img_url,
			// 社区团购
			take_a_code: '',
			loading: false,
			textColor:'#bc0100',
			userMessage:{},
			showFoucs:false,
			currencyAlias:{
				balance_alias: '',
				red_envelope_alias: '',
				integral_alias: '',
				silver_beans_alias: '',
			},
			
			
			editParentModal:false,
			editParentForm:{
				phone:''
			}
		};
	},
	onLoad: function(options) {
		//#ifdef MP-WEIXIN
		if(options.user_id){
			uni.setStorageSync('parent_user_id',options.user_id);
		}
		//#endif
		this.textColor = this.globalSet('textCol');
		let obj = {};
		// #ifdef MP-WEIXIN
		obj = wx.getMenuButtonBoundingClientRect();
		// #endif
		// #ifdef MP-BAIDU
		obj = swan.getMenuButtonBoundingClientRect();
		// #endif
		// #ifdef MP-ALIPAY
		my.hideAddToDesktopMenu();
		// #endif
		

		uni.getSystemInfo({
			success: res => {
				this.width = obj.left || res.windowWidth;
				this.height = obj.top ? obj.top + obj.height + 8 : res.statusBarHeight + 44;
				this.top = obj.top ? obj.top + (obj.height - 32) / 2 : res.statusBarHeight + 6;
				this.scrollH = res.windowWidth * 0.6;
			}
		});
		let currencyAliasConfig = uni.getStorageSync('currencyAlias');
		if(currencyAliasConfig){
			JSON.parse(currencyAliasConfig);
			this.currencyAlias = JSON.parse(currencyAliasConfig);
		}
		if (uni.getStorageSync('token')) {
			this.mytoken = uni.getStorageSync('token');
		}else{
			this.mytoken=0
			uni.removeStorageSync('addressID')
			uni.showModal({
				title: "提示",
				content: "您还未登录，去登录吧~",
				confirmText: "去登录",
				showCancel:false,
				success: (res) => {
					if (res.confirm) {
						uni.navigateTo({
							url: '/pages/public/login'
						});
					}else{
						
					}
				}
			});
		}
		//this.initData(false);
	},
	onShow() {
		this.$http.isLogin() && this.getUser(false);
		if(uni.getStorageSync('token')){
			this.initData(false);
		}
	},
	methods: {
		
		async confirmSubmit(){
			let self = this;
			self.editParentModal = false;
			let isMobile = /^1[3-9]\d{9}$/.test(this.editParentForm.phone)
			if(!isMobile){
				self.$http.toast('供货商手机号格式错误');return ;
			}
			uni.showLoading({mask:true});
			let res = await self.$http.request({
				url:self.$api.default.changeParent,
				method:'post',
				data:self.editParentForm
			});
			uni.hideLoading();
			if(res.code != 0){
				self.$http.toast(res.msg);return ;
			}
			self.$http.toast("操作成功");
			setTimeout(function(){
				self.getUser()
			},1000)
		},
		
		closeHandler(){
			this.editParentModal = false
		},
		copyText(text) {

			let _self = this;
			// #ifdef H5
			return new Promise((resolve, reject) => {
				let copy = document.createElement("input"); // 创建一个input框获取需要复制的文本内容
				copy.value = text;
				let appDiv = document.getElementsByClassName('app')[0];
				appDiv.appendChild(copy);
				copy.select();
				document.execCommand("Copy");
				_self.$http.toast("复制成功")
				copy.remove()
				resolve(true);
			})
			// #endif

			// #ifndef H5
			uni.setClipboardData({
				data: text,
				success: function() {
					_self.$http.toast("复制成功")
				}
			});
			// #endif

		},
		foucusInfo(){
			uni.navigateTo({
				url: '/pages/diy/diy?page_id=114'
			});
		},
		link(){
			uni.navigateTo({
				url:'../personalCentre/accountingOrder/accountingOrder'
			})
		},
		userLogin() {
			// #ifdef H5
			let pages = getCurrentPages();
			let curPage = pages[pages.length - 1];
			let preUrl = curPage.$route.fullPath;
			uni.setStorageSync('_login_pre_url', preUrl);
			uni.removeStorageSync('token');
			uni.removeStorageSync('initMenus');
			// #endif
			uni.navigateTo({
				url: '/pages/public/login'
			});
		},
		initData() {
			this.$http
				.request({
					url: this.$api.index.userConfig
				})
				.then(res => {
					if (res.code === 0) {
						this.configData = res.data.config;
						this.userMessage=res.data.config;
						uni.setStorageSync('initMenus', JSON.stringify(res.data.config));
						if(res.wechat_subscribe==1){
							this.showFoucs=false
						}else{
							this.showFoucs=true
						}
					}
				});
		},
		getUser(bool) {
			this.loading = bool;
			this.$http
				.request({
					url: this.$api.user.userInfo,
					method: 'POST',
					showLoading: true
				})
				.then(res => {
					this.loading = false;
					if (res.code == 0) {
						this.userInfo = res.data;
						let token = uni.getStorageSync('token') || 0;
						uni.setStorageSync('userInfo', JSON.stringify(res.data));
						if(res.wechat_subscribe==1){
							this.showFoucs=false
						}else{
							this.showFoucs=true
						}
						
					} else {
						uni.removeStorageSync('userInfo');
						this.userInfo = {
							balance: 0,
							score: 0,
							coupon: 0
						};
						this.showFoucs=true
					}
				});
		},
		openUrl(name) {
			let url=''
			if(name=='balance'){
				url='./balance/details'
			}else if(name=='total_score'){
				url='./integral/integral'
			}else if(name=='redBag'){
				url='../../mch/redBag/redBag'
			}else if(name=='shopping_voucher'){
				url='../../mch/vouchers/vouchers'
			}			
			uni.navigateTo({
				url: url+"?name="+name,
			});
		},
		openlink(url){
			uni.navigateTo({
				url:url
			})
		},
		href(page) {
			let url = '';
			switch (page) {
				case 1:
					break;
				case 2:
					url = './setting';
					break;
				case 3:
					url = './info';
					break;
				case 4:
					url = '../order/list';
					break;
				default:
					break;
			}
			if (url) {
				uni.navigateTo({
					url: url
				});
			} else {
				this.$http.toast('功能尚未完善~');
			}
		},
		checkSign() {
			this.modal = true;
		},
		hide() {
			this.modal = false;
		},
		// 显示取件码
		showCode() {
			this.take_a_code = '';
		},
		// 隐藏取件码
		codeHide() {
			this.take_a_code = '';
		},
		shopInto(){ //点击进入商户页面
			uni.navigateTo({
				url:'../personalCentre/personalCentre'
			})
		}
	},
	onPageScroll(e) {
		let scroll = e.scrollTop <= 0 ? 0 : e.scrollTop;
		let opcity = scroll / this.scrollH;
		if (this.opcity >= 1 && opcity >= 1) {
			return;
		}
		this.opcity = opcity;
		this.iconOpcity = 0.5 * (1 - opcity < 0 ? 0 : 1 - opcity);
	},
	onPullDownRefresh() {
		setTimeout(() => {
			uni.stopPullDownRefresh();
			this.$http.isLogin() && this.getUser(true);
		}, 1000);
	}
};
</script>

<style lang="scss" scoped>
.jx-header-box {
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9998;
}

.jx-header {
	width: 100%;
	line-height: 18px;
	font-weight: 500;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.jx-modal-custom {
	display: flex;
	flex-direction: column;
}

.jx-modal-custom-text {
	text-align: center;
}

.btns { 
	display: flex;
}
.user_shop{
	position: absolute;
	right: 100upx;
	color:#000;
	min-width: 100upx;
	text-align: center;
	background:#fff;
	border-radius: 20upx;
	font-size:30upx ;
}
.member {
	height: 80rpx;
	margin: 20rpx 0;

	.vip-card {
		width: 100%;
		height: 100%;
	}
}

/* #ifndef MP */
.jx-header-icon {
	position: fixed;
	top: 0;
	right: 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 32px;
	transform: translateZ(0);
	z-index: 99999;
}

/* #endif */
/* #ifdef MP */
.jx-set-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* #endif */
.jx-icon-box {
	position: relative;

	.icon {
		font-size: 44rpx;
		line-height: 48rpx;
		margin-right: 20rpx;
	}

	&:last-child {
		.icon {
			margin-right: 10rpx;
		}
	}
}

.jx-icon-setup {
	margin-left: 8rpx;
}

.jx-badge {
	position: absolute;
	font-size: 9pt;
	height: 30rpx;
	/* #ifdef H5 */
	min-width: 30rpx;
	/* #endif */
	/* #ifndef H5 */
	min-width: 20rpx;
	/* #endif */
	padding: 0 6rpx;
	border-radius: 40rpx;
	right: 10rpx;
	top: -5rpx;
	transform: scale(0.8) translateX(60%);
	transform-origin: center center;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10;
}

.jx-badge-red {
	background: #f74d54;
	color: #fff;
	right: 0;
}

.jx-badge-white {
	background: #fff;
	color: #f74d54;
}

.jx-badge-dot {
	position: absolute;
	height: 12rpx;
	width: 12rpx;
	border-radius: 50%;
	right: -12rpx;
	top: 0;
	background: #f74d54;
}

.jx-mybg-box {
	width: 100%;
	// height: 360rpx;
	position: relative;
	display: flex;
	align-items: center;
	// padding: 120rpx 0 100rpx;
}

.jx-my-bg {
	width: 100%;
	// height: 464rpx;
	height: 420rpx;
	display: block;
	position: absolute;
	top: 0;
}

.jx-header-center {
	width: 100%;
	// height: 128rpx;
	padding: 80rpx 30rpx 60rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	position: relative;

	&.top {
		justify-content: center;
		flex-direction: column;
		margin-bottom: 36rpx;

		.jx-info {
			/* #ifndef APP-NVUE */
			display: flex;
			/* #endif */
			flex-direction: column;
			align-items: center;

			.jx-nickname {
				margin: 0;
			}
		}
	}

	.withdraw {
		position: absolute;
		right: 0;
		color: #ffffff;
		.icon-text {
			align-items: center;
			background: rgba(0, 0, 0, 0.2);
			font-size: 9pt;
			line-height: 54rpx;
			padding: 0 20rpx;
			border-bottom-left-radius: 27rpx;
			border-top-left-radius: 27rpx;

			.img {
				height: 37rpx;
				width: 37rpx;
				margin-right: 10rpx;
			}

			.icon {
				font-size: 11pt;
				line-height: 26px;

				&.icon-tixian {
					margin-left: 10rpx;
				}
			}

			.text {
				margin-left: 6rpx;
			}
		}
	}
}

.marginB{
	padding: 60rpx 30rpx 20rpx;
}

.icon-img {
	background-size: 100%;
	background-repeat: no-repeat;
}

.jx-avatar {
	flex-shrink: 0;
	width: 128rpx;
	height: 128rpx;
	display: block;
	border-radius: 50px;
}

.jx-info {
	// width: 60%;
	margin-left: 20rpx;
	color: #ffffff;
	background: transparent;
	/* #ifdef MP-WEIXIN */
	flex-grow: 1;
	text-align: left;
	/* #endif */

	.jx-nickname {
		font-size: 14pt;
		font-weight: 400;
		display: flex;
		align-items: center;
		margin-bottom: 4rpx;

		.nickname {
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			max-width: 240rpx;
		}
	}

	.user-id {
		font-size: 10pt;
		margin-left: 10rpx;
	}
}

.jx-img-vip {
	height: 36rpx;
	// margin-left: 18rpx;
	display: flex;
	align-items: center;
	background-color: #ffffff;
	color: #FF7104;
	padding: 0 10rpx;
	border-radius: 19rpx;
	line-height: 18px;
	.vip_url {
		width: 28rpx;
		height: 26rpx;
	}
	.iconfont {
		font-size: 13pt;
		width: 28rpx;
		height: 20rpx;
		line-height: 26rpx;
	}
	.text {
		margin-left: 12rpx;
		font-size: 9pt;
		font-weight: 400;
	}
}

.address {
	font-size: 10.5pt;
	background-color: #ffffff;
	padding: 0 20rpx;
	border-radius: 15rpx;

	.address-title {
		line-height: 88rpx;
		padding: 0 16rpx;
		border-bottom: 2rpx solid #f2f2f2;
		.cut-address {
			color: $jx-color-primary;
			.iconfont {
				font-size: 16pt;
				width: 16px;
			}
		}
	}

	.address-info {
		padding: 32rpx 16rpx;
		line-height: 48rpx;
		.store-name {
			color: $jx-color-primary;
			line-height: 44rpx;
		}
		.remark {
			font-size: 9pt;
			color: #939393;
			line-height: 44rpx;
		}

		.shield {
			width: 22rpx;
			height: 24rpx;
			background-size: 100%;
			background-repeat: no-repeat;
			margin-right: 13rpx;
		}
	}
}

.color-333333 {
	color: #333333;
}

.jx-explain {
	width: 80%;
	font-size: 9pt;
	font-weight: 400;
	color: #fff;
	opacity: 0.75;
	padding-top: 8rpx;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.jx-btn-edit {
	flex-shrink: 0;
	padding-right: 22rpx;
}

.jx-header-btm {
	border-radius: 12rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #000;
	background: #ffffff;
	margin-bottom: 20rpx;
}

.jx-btm-item {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 40rpx 10rpx;
	position: relative;
	&::after {
		content: '';
		border-right: 1rpx solid #b3b3b3;
		width: 1px;
		height: 100rpx;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	&:last-child {
		&::after {
			display: none;
		}
	}
}

.jx-btm-num {
	font-size: 11pt;
	font-weight: 600;
	position: relative;
}

.jx-btm-text {
	font-size: 9pt;
	opacity: 0.85;
	padding-top: 4rpx;
}

.jx-content-box {
	margin-bottom: 30rpx;
	width: 100%;
	padding: 0 30rpx;
	box-sizing: border-box;
	position: relative;
	// top: -72rpx;
	z-index: 10;
}

.jx-box {
	width: 100%;
	background: #fff;
	box-shadow: 0 3rpx 20rpx rgba(183, 183, 183, 0.1);
	border-radius: 10rpx;
	overflow: hidden;
}
.jx-info-box {
	height: 100rpx;
	padding: 0 40rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	background-color: #ffe691;
	color:#7d5912;
	margin-bottom: 20rpx;
}
.jx-info-box .text{
	margin-left:10rpx;
}
.jx-order-box {
	// height: 300rpx;
	overflow: hidden;
}

.jx-cell-header {
	width: 100%;
	height: 100rpx;
	padding: 0 40rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1rpx solid #f3f3f3;
}

.jx-cell-title {
	font-size: 11pt;
	line-height: 30rpx;
	font-weight: 400;
	color: #333;
	font-weight: 600;
	letter-spacing: 1px;
}

.jx-cell-sub {
	font-size: 9pt;
	font-weight: 400;
	color: #999;
	padding-right: 10rpx;
}

.jx-order-list {
	width: 100%;
	height: 280rpx;
	// padding: 0 30rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}

.jx-order-item {
	// flex: 1;
	width: 25%;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 20rpx 0;
}

.jx-order-text,
.jx-tool-text {
	font-size: 10pt;
	font-weight: 400;
	color: #333;
	padding-top: 4rpx;
}

.jx-tool-text {
	font-size: 9pt;
}

.jx-order-icon {
	width: 56rpx;
	height: 56rpx;
	display: block;
}

.jx-assets-box {
	height: 178rpx;
	margin-top: 20rpx;
}

.jx-assets-list {
	height: 84rpx;
}

.jx-assets-num {
	font-size: 12pt;
	font-weight: 500;
	color: #333;
	position: relative;
}

.jx-assets-text {
	font-size: 9pt;
	font-weight: 400;
	color: #666;
	padding-top: 6rpx;
}

.jx-tool-box {
	margin-top: 20rpx;
}

.jx-flex-wrap {
	flex-wrap: wrap;
	height: auto;
	padding-bottom: 30rpx;
}

.jx-tool-item {
	width: 25%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding-top: 30rpx;
}

.jx-tool-icon {
	width: 64rpx;
	height: 64rpx;
	display: block;
}

.jx-badge-icon {
	width: 66rpx;
	height: 30rpx;
	position: absolute;
	right: 0;
	transform: translateX(88%);
	top: -15rpx;
}

/*为你推荐*/
.jx-product-list {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	box-sizing: border-box;
}

.jx-product-container {
	flex: 1;
	margin-right: 2%;
}

.jx-product-container:last-child {
	margin-right: 0;
}

.jx-pro-item {
	width: 100%;
	margin-bottom: 4%;
	background: #fff;
	box-sizing: border-box;
	border-radius: 12rpx;
	overflow: hidden;
}

.jx-pro-img {
	width: 100%;
	display: block;
}

.jx-pro-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	padding: 20rpx;
}

.jx-pro-tit {
	color: #2e2e2e;
	font-size: 9pt;
	word-break: break-all;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.jx-pro-price {
	padding-top: 18rpx;
}

.jx-sale-price {
	font-size: 13pt;
	font-weight: 500;
	color: #e41f19;
}

.jx-factory-price {
	font-size: 9pt;
	color: #a0a0a0;
	text-decoration: line-through;
	padding-left: 12rpx;
}

.jx-pro-pay {
	padding-top: 10rpx;
	font-size: 9pt;
	color: #656565;
}
.tack-code {
	width: 307rpx;
	height: 307rpx;
}
.fui-cell-group {
		margin-top: 0.5rem;
		background-color: #fff;
		line-height: 1.4;
		font-size: 0.8rem;
		overflow: hidden;
		position: relative;
		display: block;
	}

	.fui-cell-group .fui-cell {
		position: relative;
		padding: 0.75rem 0.6rem 0.65rem;
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		-moz-transition-duration: 300ms;
		-webkit-transition-duration: 300ms;
		transition-duration: 300ms;
		-webkit-transition-property: background-color;
		transition-property: background-color;
		line-height: 1.2;
	}

	.fui-cell-group .fui-cell:before {
		content: " ";
		position: absolute;
		left: 0.5rem;
		right: 0.5rem;
		bottom: -1px;
		height: 1px;
		border-top: 1px solid #ebebeb;
		color: #D9D9D9;
		-webkit-transform-origin: 0 0;
		-ms-transform-origin: 0 0;
		transform-origin: 0 0;
		-webkit-transform: scaleY(0.5);
		-ms-transform: scaleY(0.5);
		transform: scaleY(0.5);
	}

	.fui-cell-group .fui-cell:last-child:before {
		display: none;
	}

	.fui-cell-group .fui-cell .fui-cell-info {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		-ms-flex: 1;
		flex: 1;
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
		font-size: .7rem;
		color: #000;
	}

	.fui-cell-group .fui-cell .fui-cell-label {
		position: relative;
		display: block;
		// width: 6.85rem;
		font-size: 0.7rem;
		color: #666;
		display: flex;
		align-items: center;
	}

	/*! CSS Used from: https://shop.tytjk.cn/plugin/many_shop/template/mobile/default/static/css/style2.2.css?v=20230619006 */
	a {
		color: #ff6600;
	}

	.text-red {
		color: #E43B26 !important;
	}

	.text-black {
		color: #111111 !important;
	}

	.bg-red {
		background: linear-gradient(to left, #EF5264, #D5283D);
	}

	.f-5 {
		font-size: 0.5rem !important;
	}

	.f-6 {
		font-size: 0.6rem !important;
	}

	.f-7 {
		font-size: 0.7rem !important;
	}

	.content {
		height: auto;
		white-space: break-spaces;
		text-align: center;
	}

	.content img {
		width: 100%;
		border: 0;
		padding: 0;
	}

	view::-webkit-scrollbar {
		display: none;
	}

	.fui-list-item .pic_mark {
		position: absolute;
		right: 0;
		top: 0;
		width: 1.55rem;
	}

	.groups {
		width: 96%;
		margin: 0.5rem auto;
		border-radius: 10px;
	}

	.text-grey {
		color: #999 !important;
	}

	.fui-cell-group .fui-cell .fui-cell-right {
		font-size: 0.6rem;
		color: #666;
	}
	
	
	.jx-modal-title {
		text-align: center;
		font-size: 34rpx;
		color: #333;
		padding-top: 20rpx;
		font-weight: bold;
	}
	.shopSetting-item {
		width: 90%;
		margin: 0 auto;
		border-bottom: 1rpx solid #888888;
		overflow: hidden;
		display: flex;
		justify-content: space-between
	}
	.shopSetting-title {
		height: 100rpx;
		line-height: 100rpx;
		margin-right: 20rpx;
		color: #000;
	}
	
	.shopSetting-int {
		height: 100rpx;
		display: flex;
	}
	.shopSetting-int text{display: block;height: 100rpx;line-height: 100rpx;
		overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
	}
	.shopSetting-int input {
		height: 100rpx;
		text-align: right;
	}
</style>
